<template>
  <div class="main-nav">
    <el-container>
      <el-header :style="{height: topHeight + 'px',lineHeight: topHeight + 'px'}">
        <top-nav/>
      </el-header>
      <el-container>
        <el-aside :style="{height: height + 'px',width: '15%'}">
          <left-nav/>
        </el-aside>
        <el-main>
          <div :style="{height:(height-topHeight) + 'px',overflowY: 'auto'}">
            <main-nav/>
          </div>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
import LeftNav from "@/components/common/LeftNav.vue";
import TopNav from "@/components/common/TopNav.vue";
import MainNav from "@/components/common/MainNav.vue";
export default {
  name: 'GuangMain',
  components: {LeftNav,TopNav,MainNav},
  data(){
   return{
     msg: 'guang++++'
   }
  },
}
</script>

<style scoped>

</style>
